import React, { useState, useRef } from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import {
  Card,
  Button,
  Row,
  Col,
  Space,
  Form,
  Checkbox,
  Tabs,
  Modal,
  Select,
  DatePicker,
  Input,
  Radio,
  InputNumber,
  Dropdown,
  message,
  Tooltip,
  Menu,
  Upload,
  Drawer,
} from 'antd';
import {
  PlusOutlined,
  QuestionCircleOutlined,
  RightOutlined,
  DownOutlined,
  CloseOutlined,
  ExclamationCircleOutlined,
  ExportOutlined,
  ImportOutlined,
} from '@ant-design/icons';
import BomTree from './bomTree';
import { connect, FormattedMessage, useIntl } from 'umi';
import moment from 'moment';
import { ResourceGrpSelect, ResourceSelect, OpMasterSelect } from '@/components/FormItemSelect';
import request from '@/utils/request';
import UploadUtil from '@/components/UploadUtil';
import DocHelper from '@/components/DocHelper';
import QuickMenu from '@/components/QuickMenu';
import QuerySelect from '@/components/QuerySelect';

const { TabPane } = Tabs;
const { confirm } = Modal;
const layout = {
  labelCol: { span: 3 },
  wrapperCol: { span: 15 },
};
const apiURL = '/api/services/app/PartBOM/';
const apiURLBoo = '/api/services/app/PartBOO/';
const apiURLMtl = '/api/services/app/PartMtl/';
const ViewPage: React.FC<any> = (props) => {
  const [loading, setLoading] = useState(false);
  const [loading2, setLoading2] = useState(false);
  const [visible, setVisible] = useState(false);
  const [defTab, setDefTab] = useState('1');
  const [defTab2, setDefTab2] = useState('S1');
  const [currPartBom, setCurrPartBom] = useState<any>({});
  const [currPartBoo, setCurrPartBoo] = useState<any>({});
  const [currPartMtl, setCurrPartMtl] = useState<any>({});
  const [rootPart, setRootPart] = useState<any>({ partNum: '', bomLevel: 0 });
  const [BomData, setBomData] = useState({});
  const [partRevs, setPartRevs] = useState([]);
  const [partRevs2, setPartRevs2] = useState([]);
  const intl = useIntl();
  const formRef = useRef<any>();
  const bomTree = useRef<any>(BomTree);

  const onFinish = (values: any) => {
    var PartRoot = values.PartBOM;
    var PartBOM = values.Asmbl;
    var PartBOO = values.PartBOO;
    var PartMtl = values.PartMtl;
    if (defTab == '1') {
      savePartBom(PartRoot, true);
    } else {
      if (defTab2 == 'S1') {
        savePartBoo(PartBOO);
      } else if (defTab2 == 'S2') {
        savePartBom(PartBOM);
      } else {
        savePartMtl(PartMtl);
      }
    }
  };

  const savePartBom = (PartBOM: any, isRoot: boolean = false) => {
    PartBOM.effectiveDate = PartBOM.effectiveDate?.format('YYYY-MM-DD');
    PartBOM.approved = !PartBOM.approved ? false : PartBOM.approved;
    PartBOM.inActive = !PartBOM.inActive ? false : PartBOM.inActive;
    if (!isRoot) {
      PartBOM.bomType = rootPart.bomType;
    }
    var act = 'New';
    var method = 'POST';
    if (PartBOM.id) {
      act = 'Update';
      method = 'PUT';
    }
    request(apiURL + act, {
      method: method,
      data: PartBOM,
    }).then((response) => {
      if (response) {
        if (response.success) {
          message.success(intl.formatMessage({id:'pages.save.success'}));
          getBom();
        }
        setLoading(false);
      }
    });
  };

  const savePartBoo = (PartBOO: any) => {
    var act = 'Create';
    var method = 'POST';
    if (PartBOO.id) {
      act = 'Update';
      method = 'PUT';
    }
    PartBOO.opDesc = PartBOO.opCode;
    request(apiURLBoo + act, {
      method: method,
      data: PartBOO,
    }).then((response) => {
      if (response) {
        if (response.success) {
          message.success(intl.formatMessage({id:'pages.save.success'}));
          getBom();
        }
        setLoading(false);
      }
    });
  };

  const savePartMtl = (PartMtl: any) => {
    var act = 'New';
    var method = 'POST';
    if (PartMtl.id) {
      act = 'Update';
      method = 'PUT';
    }
    PartMtl.mfgComment = '-';
    PartMtl.purComment = '-';
    PartMtl.relatedOpRev = 'A';

    request(apiURLMtl + act, {
      method: method,
      data: PartMtl,
    }).then((response) => {
      if (response) {
        if (response.success) {
          message.success(intl.formatMessage({id:'pages.save.success'}));
          getBom();
        }
        setLoading(false);
      }
    });
  };

  const setCurrent = (part?: any) => {
    var PartBOM: any = {};
    PartBOM.partNum = part.PartNum;
    PartBOM.partDescription = part.PartDescription;
    PartBOM.ium = part.IUM;
    formRef.current.setFieldsValue({ PartBOM });
    setPartRevs(part.Revs?.split(','));
  };

  const setCurrent2 = (part?: any) => {
    var Asmbl: any = {};
    Asmbl.partNum = part.PartNum;
    Asmbl.partDescription = part.PartDescription;
    Asmbl.ium = part.IUM;
    formRef.current.setFieldsValue({ Asmbl });
    setCurrPartBom(Asmbl);
    setPartRevs2(part.Revs?.split(','));
  };

  const setCurrent3 = (part?: any) => {
    var PartMtl: any = {};
    PartMtl.partNum = part.PartNum;
    PartMtl.partDescription = part.PartDescription;
    PartMtl.ium = part.IUM;
    formRef.current.setFieldsValue({ PartMtl });
  };

  const setCurrentAsmb = (item: any, type: string) => {
    if (type == 'mtl') {
      setCurrPartMtl(item);
      setDefTab('2');
      setDefTab2('S3');
      formRef.current.setFieldsValue({ PartMtl: item });
    } else if (type == 'asm') {
      setCurrPartBom(item);
      setDefTab('2');
      setDefTab2('S2');
      formRef.current.setFieldsValue({ Asmbl: item });
    } else if (type == 'boo') {
      setCurrPartBoo(item);
      setDefTab('2');
      setDefTab2('S1');
      formRef.current.setFieldsValue({ PartBOO: item });
    } else {
      setCurrPartBom(item);
      setDefTab('1');
      setRootPart(item);
      formRef.current.setFieldsValue({ PartBOM: item });
    }
  };

  const getBom = () => {
    var obj = formRef.current.getFieldsValue();
    var partNum = obj.PartBOM.partNum;
    var revNum = obj.PartBOM.revisionNum;

    if (partNum && revNum) {
      setLoading(true);
      request(apiURL + 'GetBOM', {
        method: 'GET',
        params: {
          partNum,
          revNum,
        },
      }).then((response: any) => {
        var BomData = response?.result;
        if (BomData && BomData.node) {
          setBomData(BomData);
          bomTree.current.fetchData(response.result);
          BomData.node.effectiveDate = moment(BomData.node?.effectiveDate);
          if (BomData.childs && BomData.childs.length > 0) {
            setCurrentAsmb(BomData.childs[0].node, 'asm');
          }
          if (BomData.boos && BomData.boos.length > 0) {
            setCurrentAsmb(BomData.boos[0].node, 'boo');
            var mtls = BomData.boos[0].mtls;
            if (mtls && mtls.length > 0) {
              setCurrentAsmb(mtls[0], 'mtl');
            }
          }
          setCurrentAsmb(BomData.node, 'root');
        } else {
          setBomData({});
          bomTree.current.resetBomTree();
        }
        setLoading(false);
      });
    }
  };

  const tabSwitch = (key: any) => {
    setDefTab(key);
  };

  const tabSwitch2 = (key: any) => {
    setDefTab2(key);
  };

  const onRef = (ref: any) => {
    bomTree.current = ref;
  };

  const ResetForm = () => {
    setBomData({});
    bomTree.current.resetBomTree();
    formRef.current.resetFields();
  };

  const handleMenuClick = (e: any) => {
    if (e.key === '1') {
      ResetForm();
      setDefTab('1');
    } else if (e.key === '2') {
      if (currPartBom == null) {
        message.warning(intl.formatMessage({id:'pages.warning.addSemiFinished'}));
        return;
      }
      formRef.current.setFieldsValue({
        PartBOO: {
          id: undefined,
          oprSeq: 10,
          opCode: '',
          machines: 1,
          schedRelation: 'FS',
          setHoursPerMach: 1,
          addlSetUpQty: 1,
          addlSetupHours: 1,
          prodStandard: 1,
          stdFormat: 'HP',
          partNum: currPartBom.partNum,
          revisionNum: currPartBom.revisionNum,
        },
      });
      setDefTab('2');
      setDefTab2('S1');
    } else if (e.key === '3') {
      if (currPartBom == null) {
        message.warning(intl.formatMessage({id:'pages.warning.addSemiFinished'}));
        return;
      }
      formRef.current.setFieldsValue({
        Asmbl: {
          id: undefined,
          partNum: '',
          revisionNum: '',
          bomSeq: currPartBom.bomSeq + 1,
          parentPartNum: currPartBom.parentPartNum,
          parentRevision: currPartBom.parentRevision,
          bomLevel: currPartBom.bomLevel + 1,
        },
      });
      setDefTab('2');
      setDefTab2('S2');
    } else {
      if (currPartBom == null) {
        message.warning(intl.formatMessage({id:'pages.warning.addSemiFinished'}));
        return;
      }
      if (currPartBoo == null || !currPartBoo.oprSeq) {
        message.warning(intl.formatMessage({id:'pages.warning.addOperation'}));
        return;
      }
      formRef.current.setFieldsValue({ PartMtl: null });
      formRef.current.setFieldsValue({
        PartMtl: {
          relatedOperation: currPartBoo.oprSeq,
          bomPartNum: currPartBom.partNum,
          bomPartRev: currPartBom.revisionNum,
        },
      });
      setDefTab('2');
      setDefTab2('S3');
    }
  };

  const cacheData = async () => {
    getBom();
  };

  const delObj = () => {
    let ctrl = apiURL;
    let id = 0;
    if (defTab == '1') {
      ctrl = apiURL;
    } else {
      if (defTab2 == 'S1') {
        ctrl = apiURLBoo;
        id = currPartBoo.id;
      } else if (defTab2 == 'S2') {
        ctrl = apiURL;
        id = currPartBom.id;
      } else {
        ctrl = apiURLMtl;
        id = currPartMtl.id;
      }
    }
    confirm({
      title: intl.formatMessage({id:'pages.warning'}),
      icon: <ExclamationCircleOutlined />,
      content: intl.formatMessage({id:'pages.deleteConfirm'}),
      onOk() {
        request(ctrl + 'Delete', {
          method: 'DELETE',
          data: { id },
        }).then(() => {
          getBom();
        });
      },
    });
  };

  const handlerExport = async () => {
    var params = {
      partNum: rootPart.partNum,
      revNum: rootPart.revisionNum,
    };
    try {
      var resp = await request('/api/Excel/ExportBom', {
        method: 'POST',
        responseType: 'blob',
        params,
      });
      var url = window.URL.createObjectURL(resp);
      var a = document.createElement('a');
      a.href = url;
      a.download = 'BOM' + params.partNum + '.xls';
      a.click();
    } catch {
      console.log('export bom error');
    }
  };

  const handlerImport = (info: any) => {
    if (info.file.status === 'done') {
      message.success(intl.formatMessage({id:'pages.import.success'}));
      getBom();
      setLoading2(false);
    } else {
      setLoading2(true);
    }
  };

  const switchDraw = () => {
    setVisible(!visible);
  };

  const selectRev = (
    <Select placeholder={intl.formatMessage({id:'pages.revision.select'})} onChange={getBom}>
      {partRevs?.map((item: any) => {
        return (
          <Select.Option key={item} value={item}>
            {item}
          </Select.Option>
        );
      })}
    </Select>
  );
  const selectRev2 = (
    <Select placeholder={intl.formatMessage({id:'pages.revision.select'})}>
      {partRevs2?.map((item: any) => {
        return (
          <Select.Option key={item} value={item}>
            {item}
          </Select.Option>
        );
      })}
    </Select>
  );

  return (
    <PageHeaderWrapper title={false} breadcrumbRender={false} ghost>
      <Form {...layout} ref={formRef} onFinish={onFinish}>
        <Row gutter={[16, 16]}>
          <Col span={24}>
            <Card>
              <Space key="S1">
                <Dropdown
                  overlay={
                    <Menu onClick={handleMenuClick}>
                      <Menu.Item key="1" icon={<RightOutlined />}>
                        {intl.formatMessage({id:'pages.newBOM'})}
                      </Menu.Item>
                      <Menu.Item key="2" icon={<RightOutlined />}>
                        {intl.formatMessage({id:'pages.newOperation'})}
                      </Menu.Item>
                      <Menu.Item key="3" icon={<RightOutlined />}>
                        {intl.formatMessage({id:'pages.newSemiFinished'})}
                      </Menu.Item>
                      <Menu.Item key="4" icon={<RightOutlined />}>
                        {intl.formatMessage({id:'pages.newMaterial'})}
                      </Menu.Item>
                    </Menu>
                  }
                >
                  <Button type="primary" icon={<PlusOutlined />}>
                    {intl.formatMessage({id:'pages.add'})} <DownOutlined />
                  </Button>
                </Dropdown>

                <Button type="primary" htmlType="submit" loading={loading}>
                  {intl.formatMessage({id:'pages.save'})}
                </Button>
                <Button type="dashed" onClick={cacheData}>
                  {intl.formatMessage({id:'pages.refresh'})}
                </Button>
                <Button danger icon={<CloseOutlined />} onClick={delObj}>
                  {intl.formatMessage({id:'pages.delete'})}
                </Button>
                <Button type="default" onClick={switchDraw}>
                  {intl.formatMessage({id:'pages.manufacturingProcess'})}
                </Button>
                <Button
                  type="primary"
                  icon={<ExportOutlined />}
                  onClick={handlerExport}
                  loading={loading}
                >
                  {intl.formatMessage({id:'pages.export'})}
                </Button>
                <Upload
                  accept=".xls,.xlsx,application/vnd.ms-excel"
                  name="file"
                  action="/api/Excel/ImportBOM"
                  headers={{
                    Authorization: UploadUtil.accessToken,
                  }}
                  beforeUpload={UploadUtil.checkExcel}
                  showUploadList={false}
                  onChange={handlerImport}
                >
                  <Button type="primary" loading={loading2} icon={<ImportOutlined />}>
                    {intl.formatMessage({id:'pages.import'})}
                  </Button>
                </Upload>
                <QuickMenu path="/manufacture/bomDesign" icon="icon-support" title="pages.BomDesign" />
                <DocHelper page="rkrc0w" />
              </Space>
              <Tabs defaultActiveKey={defTab} activeKey={defTab} onChange={tabSwitch}>
                <TabPane tab={intl.formatMessage({id:'pages.version'})} key="1">
                  <Form.Item label={intl.formatMessage({id:'pages.materialCode'})} style={{ marginBottom: 0 }} required>
                    <Input.Group compact>
                      <Form.Item
                        noStyle
                        name={['PartBOM', 'partNum']}
                        rules={[{ required: true, message: intl.formatMessage({id:'pages.materialCode.required'}) }]}
                      >
                        <Input style={{ width: 120 }} disabled />
                      </Form.Item>
                      <Form.Item noStyle>
                        <QuerySelect
                          width={680}
                          sysReportName="PartSearch"
                          text={<FormattedMessage id="pages.select" />}
                          title={<FormattedMessage id="pages.partNum" />}
                          btntype="primary"
                          setCurrent={setCurrent}
                          scroll={{ x: 'max-content', y: '200px' }}
                          params={{ InActive: 'false' }}
                        />
                      </Form.Item>
                      <Form.Item
                        name={['PartBOM', 'revisionNum']}
                        rules={[{ required: true, message: intl.formatMessage({id:'pages.revision.required'}) }]}
                      >
                        {selectRev}
                      </Form.Item>
                    </Input.Group>
                  </Form.Item>
                  <Form.Item name={['PartBOM', 'id']} hidden={true}>
                    <Input />
                  </Form.Item>
                  <Form.Item label={intl.formatMessage({id:'pages.materialDescription'})} name={['PartBOM', 'partDescription']}>
                    <Input disabled={true} />
                  </Form.Item>
                  <Form.Item
                    label={intl.formatMessage({id:'pages.effectiveDate'})}
                    name={['PartBOM', 'effectiveDate']}
                    rules={[{ required: true, message: intl.formatMessage({id:'pages.effectiveDate.required'}) }]}
                  >
                    <DatePicker />
                  </Form.Item>
                  <Form.Item
                    label={intl.formatMessage({id:'pages.bomType'})}
                    name={['PartBOM', 'bomType']}
                    rules={[{ required: true }]}
                  >
                    <Select style={{ width: 200 }} placeholder={intl.formatMessage({id:'pages.bomType'})}>
                      <Select.Option value="des">{intl.formatMessage({id:'pages.design'})}</Select.Option>
                      <Select.Option value="mfg">{intl.formatMessage({id:'pages.manufacturing'})}</Select.Option>
                    </Select>
                  </Form.Item>
                  <Form.Item label={intl.formatMessage({id:'pages.singleSetQuantity'})}>
                    <Input.Group compact>
                      <Form.Item
                        noStyle
                        name={['PartBOM', 'qtyPer']}
                        rules={[{ required: true, message: intl.formatMessage({id:'pages.quantity.required'}) }]}
                      >
                        <InputNumber min={0} />
                      </Form.Item>
                      <Form.Item noStyle name={['PartBOM', 'ium']} rules={[{ required: true }]}>
                        <Input placeholder={intl.formatMessage({id:'pages.IUM'})} style={{ width: 80 }} />
                      </Form.Item>
                    </Input.Group>
                  </Form.Item>
                  <Form.Item wrapperCol={{ offset: layout.labelCol.span }}>
                    <Input.Group compact>
                      <Form.Item name={['PartBOM', 'inActive']} valuePropName="checked">
                        <Checkbox defaultChecked={false}>{intl.formatMessage({id:'pages.inactive'})}</Checkbox>
                      </Form.Item>
                      <Form.Item name={['PartBOM', 'approved']} valuePropName="checked">
                        <Checkbox defaultChecked={false}>{intl.formatMessage({id:'pages.approved'})}</Checkbox>
                      </Form.Item>
                    </Input.Group>
                  </Form.Item>
                </TabPane>
                <TabPane tab={intl.formatMessage({id:'pages.manufacturingProcess'})} key="2">
                  <Tabs defaultActiveKey={defTab2} activeKey={defTab2} onChange={tabSwitch2}>
                    <TabPane tab={intl.formatMessage({id:'pages.bomOper'})} key="S1">
                      <Form.Item name={['PartBOO', 'id']} hidden>
                        <Input />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.semiFinished'})} required style={{ marginBottom: 0 }}>
                        <Input.Group compact>
                          <Form.Item
                            name={['PartBOO', 'partNum']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.semiFinished.required'}) }]}
                          >
                            <Input />
                          </Form.Item>
                          <Form.Item
                            name={['PartBOO', 'revisionNum']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.revision.required'}) }]}
                          >
                            <Input style={{ width: 60 }} />
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                      <Form.Item name={['PartBOO', 'oprSeq']} label={intl.formatMessage({id:'pages.sequence'})}>
                        <InputNumber min={1} step={1} />
                      </Form.Item>
                      <Form.Item style={{ marginBottom: 0 }} label={intl.formatMessage({id:'pages.operation'})} required>
                        <OpMasterSelect
                          width={200}
                          rules={[{ required: true, message: intl.formatMessage({id:'pages.selectOperation'}) }]}
                          showSearch={false}
                          labelInValue={false}
                          name={['PartBOO', 'opCode']}
                        />
                      </Form.Item>
                      <Form.Item
                        style={{ marginBottom: 0 }}
                        wrapperCol={{ offset: layout.labelCol.span }}
                      >
                        <Input.Group compact>
                          <Form.Item name={['PartBOO', 'subContract']} valuePropName="checked">
                            <Checkbox>{intl.formatMessage({id:'pages.subContract'})}</Checkbox>
                          </Form.Item>
                          <Form.Item name={['PartBOO', 'finalOpr']} valuePropName="checked">
                            <Checkbox>{intl.formatMessage({id:'pages.finalOperation'})}</Checkbox>
                          </Form.Item>
                          <Form.Item name={['PartBOO', 'autoReceive']} valuePropName="checked">
                            <Checkbox>{intl.formatMessage({id:'pages.autoReceive'})}</Checkbox>
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                      <Form.Item
                        name={['PartBOO', 'machines']}
                        label={
                          <span>
                            {intl.formatMessage({id:'pages.schedulingBlocks'})}&nbsp;
                            <Tooltip title={intl.formatMessage({id:'pages.schedulingBlocks.tooltip'})}>
                              <QuestionCircleOutlined />
                            </Tooltip>
                          </span>
                        }
                      >
                        <InputNumber style={{ width: 100 }} min={0} />
                      </Form.Item>
                      <Form.Item name={['PartBOO', 'schedRelation']} label={intl.formatMessage({id:'pages.schedulingMethod'})}>
                        <Radio.Group name="radiogroup">
                          <Radio value="SS">{intl.formatMessage({id:'pages.startToStart'})}</Radio>
                          <Radio value="FS">{intl.formatMessage({id:'pages.finishToStart'})}</Radio>
                          <Radio value="FF">{intl.formatMessage({id:'pages.finishToFinish'})}</Radio>
                        </Radio.Group>
                      </Form.Item>
                      <Form.Item name={['PartBOO', 'setHoursPerMach']} label={intl.formatMessage({id:'pages.hours'})}>
                        <InputNumber style={{ width: 100 }} min={0} />
                      </Form.Item>
                      <Form.Item name={['PartBOO', 'addlSetUpQty']} label={intl.formatMessage({id:'pages.additionalSetupQuantity'})}>
                        <InputNumber style={{ width: 100 }} min={0} />
                      </Form.Item>
                      <Form.Item name={['PartBOO', 'addlSetupHours']} label={intl.formatMessage({id:'pages.additionalSetupHours'})}>
                        <InputNumber style={{ width: 100 }} min={0} />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.productionStandard'})} required>
                        <Input.Group compact>
                          <Form.Item
                            noStyle
                            name={['PartBOO', 'prodStandard']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.enterProductionStandard'}) }]}
                          >
                            <InputNumber style={{ width: 200 }} min={0} />
                          </Form.Item>
                          <Form.Item noStyle name={['PartBOO', 'stdFormat']}>
                            <Select placeholder={intl.formatMessage({id:'pages.hourPerPiece'})} style={{ width: 90 }}>
                              <Select.Option value="HP">{intl.formatMessage({id:'pages.hourPerPiece'})}</Select.Option>
                              <Select.Option value="MP">{intl.formatMessage({id:'pages.minutePerPiece'})}</Select.Option>
                              <Select.Option value="PM">{intl.formatMessage({id:'pages.piecePerMinute'})}</Select.Option>
                              <Select.Option value="OH">{intl.formatMessage({id:'pages.piecePerHour'})}</Select.Option>
                            </Select>
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                      <ResourceGrpSelect
                        width={200}
                        rules={[{ required: true, message: intl.formatMessage({id:'pages.selectResourceGroup'}) }]}
                        showSearch={true}
                        name={['PartBOO', 'resourceGrpID']}
                        label={intl.formatMessage({id:'pages.resourceGroup'})}
                      />
                      <ResourceSelect
                        width={200}
                        rules={[{ required: true, message: intl.formatMessage({id:'pages.selectResource'}) }]}
                        showSearch={true}
                        name={['PartBOO', 'resourceID']}
                        label={intl.formatMessage({id:'pages.resource'})}
                      />
                      <Form.Item label={intl.formatMessage({id:'pages.operationComment'})} name={['PartBOO', 'commentText']}>
                        <Input.TextArea rows={3} />
                      </Form.Item>
                    </TabPane>
                    <TabPane tab={intl.formatMessage({id:'pages.semiFinished'})} key="S2">
                      <Form.Item name={['Asmbl', 'bomSeq']} label={intl.formatMessage({id:'pages.sequence'})}>
                        <InputNumber min={1} step={1} disabled />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.semiFinished'})} required style={{ marginBottom: 0 }}>
                        <Input.Group compact>
                          <Form.Item
                            name={['Asmbl', 'parentPartNum']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.semiFinished.required'}) }]}
                          >
                            <Input />
                          </Form.Item>
                          <Form.Item
                            name={['Asmbl', 'parentRevision']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.revision.required'}) }]}
                          >
                            <Input style={{ width: 60 }} />
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.materialCode'})} required>
                        <Input.Group compact>
                          <Form.Item
                            noStyle
                            name={['Asmbl', 'partNum']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.enterProductCode'}) }]}
                          >
                            <Input style={{ width: 120 }} disabled />
                          </Form.Item>
                          <Form.Item noStyle>
                            <QuerySelect
                              width={680}
                              sysReportName="PartSearch"
                              text={<FormattedMessage id="pages.select" />}
                              title={<FormattedMessage id="pages.partNum" />}
                              btntype="primary"
                              setCurrent={setCurrent2}
                              scroll={{ x: 'max-content', y: '200px' }}
                              params={{ InActive: 'false', TypeCode: 'M' }}
                            />
                          </Form.Item>
                          <Form.Item noStyle name={['Asmbl', 'revisionNum']}>
                            {selectRev2}
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                      <Form.Item name={['Asmbl', 'partDescription']} label={intl.formatMessage({id:'pages.description'})}>
                        <Input disabled />
                      </Form.Item>
                      <Form.Item name={['Asmbl', 'id']} hidden>
                        <Input />
                      </Form.Item>
                      <Form.Item name={['Asmbl', 'bomLevel']} hidden>
                        <Input />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.singleSetQuantity'})} required>
                        <Input.Group compact>
                          <Form.Item
                            noStyle
                            name={['Asmbl', 'qtyPer']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.quantity.required'}) }]}
                          >
                            <InputNumber min={0} style={{ width: 120 }} />
                          </Form.Item>
                          <Form.Item
                            noStyle
                            name={['Asmbl', 'ium']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.IUM.required'}) }]}
                          >
                            <Input disabled style={{ width: 80, marginRight: 10 }} />
                          </Form.Item>
                          <Form.Item name={['Asmbl', 'fixedQty']} valuePropName="checked">
                            <Checkbox>{intl.formatMessage({id:'pages.fixedQuantity'})}</Checkbox>
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                    </TabPane>
                    <TabPane tab={intl.formatMessage({id:'pages.material'})} key="S3">
                      <Form.Item name={['PartMtl', 'id']} hidden>
                        <Input />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.semiFinished'})} required style={{ marginBottom: 0 }}>
                        <Input.Group compact>
                          <Form.Item
                            name={['PartMtl', 'bomPartNum']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.semiFinished.required'}) }]}
                          >
                            <Input />
                          </Form.Item>
                          <Form.Item
                            name={['PartMtl', 'bomPartRev']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.revision.required'}) }]}
                          >
                            <Input style={{ width: 60 }} />
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                      <Form.Item name={['PartMtl', 'mtlSeq']} label={intl.formatMessage({id:'pages.materialSequence'})}>
                        <InputNumber min={1} step={1} disabled />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.materialCode'})} required>
                        <Input.Group compact>
                          <Form.Item
                            noStyle
                            name={['PartMtl', 'partNum']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.enterProductCode'}) }]}
                          >
                            <Input style={{ width: 200 }} />
                          </Form.Item>
                          <Form.Item noStyle>
                            <QuerySelect
                              width={680}
                              sysReportName="PartSearch"
                              text="查询"
                              title="物料编码"
                              btntype="primary"
                              setCurrent={setCurrent3}
                              scroll={{ x: 'max-content', y: '200px' }}
                              params={{ InActive: 'false', TypeCode: 'P' }}
                            />
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                      <Form.Item name={['PartMtl', 'partDescription']} label={intl.formatMessage({id:'pages.description'})}>
                        <Input disabled />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.relatedOperation'})} name={['PartMtl', 'relatedOperation']}>
                        <InputNumber placeholder="10" />
                      </Form.Item>
                      <Form.Item label={intl.formatMessage({id:'pages.singleSetQuantity'})} required>
                        <Input.Group compact>
                          <Form.Item
                            noStyle
                            name={['PartMtl', 'qtyPer']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.quantity.required'}) }]}
                          >
                            <InputNumber min={0} style={{ width: 120 }} />
                          </Form.Item>
                          <Form.Item
                            noStyle
                            name={['PartMtl', 'ium']}
                            rules={[{ required: true, message: intl.formatMessage({id:'pages.IUM.required'}) }]}
                          >
                            <Input
                              style={{ width: 70, marginRight: 10 }}
                              disabled
                              placeholder={intl.formatMessage({id:'pages.IUM'})}
                            />
                          </Form.Item>
                          <Form.Item name={['PartMtl', 'fixedQty']} valuePropName="checked">
                            <Checkbox>{intl.formatMessage({id:'pages.fixedQuantity'})}</Checkbox>
                          </Form.Item>
                        </Input.Group>
                      </Form.Item>
                    </TabPane>
                  </Tabs>
                </TabPane>
              </Tabs>
            </Card>
          </Col>
        </Row>
      </Form>
      <Drawer
        width={600}
        placement="right"
        closable={false}
        visible={visible}
        onClose={switchDraw}
        getContainer={false}
        mask={false}
        maskClosable={false}
        footer={
          <Button type="primary" onClick={switchDraw}>
            {intl.formatMessage({id:'pages.close'})}
          </Button>
        }
      >
        <BomTree BomData={BomData} onRef={onRef} setCurrentAsmb={setCurrentAsmb} />
      </Drawer>
    </PageHeaderWrapper>
  );
}
export default connect(({ Abp }: API.IConnectState) => ({
  response: Abp.response,
  currentUser: Abp.currentUser,
}))(ViewPage);
